<template>
  <jl-base>
    <jl-header>
      <mt-header title="查询商品" :fixed="true">
        <i slot="left">
          <mt-button icon="back" @click="back"></mt-button>
        </i>
      </mt-header>
    </jl-header>

    <jl-content>
      <div class="list_search_header">
        <input placeholder="搜索商品名称/商品编码，可模糊搜索" v-model="SPMC">
        <span @click="search">搜索</span>
      </div>
      <div class="w12 cart_pro">
        <div class="w12 cart_pro_list">
          <template v-for="item in SPLB_SHOW">
            <div class="w12 cart_pro_item" @click="checkedItem(item)">
              <div class="cart_pro_check" :class="{'true':'xuan'}[item['checked']]">
                <i class="fa fa-check"></i>
              </div>
              <div class="cart_pro_info">
                <h3 class="w12 pro_name"><em class="fl">{{item['JGLX']}}</em>{{item['SPMC']}}</h3>
                <span class="w06 mt10 font_gray">要货单价：{{item['YHDJ']}}</span>
                <span class="w06 mt10 font_gray tr">可卖数：{{item['KMS']}}</span>
              </div>
            </div>
          </template>
        </div>
      </div>
    </jl-content>

    <jl-footer fixed>
      <div class="footer_btn pr20 pl20">
        <button class="w12 ml0" @click="checkedGoodsList">已选{{SPLB_CHECKED.length}}件商品，确定</button>
      </div>
    </jl-footer>
  </jl-base>
</template>

<script>
  export default {
    props: {
      params: {
        type: Object
      }
    },
    name: 'goods',
    data() {
      return {
        SPLB: [],
        SPLB_SHOW: [],
        SPLB_CHECKED: [],
        GCBJ: '1',
        SPMC: '',
      }
    },
    methods: {
      back() {
        this.$emit('close')
      },
      search() {
        let userInfo = $Utils.getUserInfo();
        if ($Utils.isNull(this.params.BM01)) {
          $Utils.toast({message: '请在基本信息里面选择经销商!'})
          this.back();
          return
        }
        this.$engineer.searchCustomerNeedKHYHBJ({FLFS01: this.params.XSFS['KEY']})
          .then(value => {
            this.$engineer.searchCustomerNeedGoods({
              GSXX01: userInfo['PCRM_GSXX01'],
              XSBM01: this.params.BM01,
              XSFS: value[0]['FLFS01'],
              WLDW01: this.params.WLDW01,
              SPMC: this.SPMC,
              KHYHBJ: value[0]['KHYHBJ'],
              CS429: 0,
            }).then(v => {
              this.SPLB_SHOW = v;
            }).catch(e => {
            })
          })
      },
      checkedItem(item) {
        item['checked'] = !item['checked'];
        this.SPLB_SHOW = [...[], ...this.SPLB_SHOW];
      },
      checkedGoodsList() {
        this.$emit('save', this.SPLB_CHECKED);
        this.$emit('close');
      }
    },
    watch: {
      SPLB_SHOW() {
        this.SPLB_CHECKED = [];
        for (let i = 0; i < this.SPLB_SHOW.length; i++) {
          let goods = this.SPLB_SHOW[i];
          goods['YHSL'] = 1;
          if (goods.checked) {
            this.SPLB_CHECKED.push(goods);
          }
        }
      }
    }
  }
</script>

<style scoped>

</style>
